<template>
  <div>
    <CloudPopover title="Title" trigger="hover">
      <template slot="content">
        <div>Content</div>
        <div>Content</div>
      </template>
      <CloudButton> Hover me </CloudButton>
    </CloudPopover>
    <CloudPopover title="Title" trigger="focus">
      <template slot="content">
        <div>Content</div>
        <div>Content</div>
      </template>
      <CloudButton> Focus me </CloudButton>
    </CloudPopover>
    <CloudPopover title="Title" trigger="click">
      <template slot="content">
        <div>Content</div>
        <div>Content</div>
      </template>
      <CloudButton> Click me </CloudButton>
    </CloudPopover>
  </div>
</template>

<script>
  export default {
    title: '3. 三种触发方式',
    subTitle: '鼠标移入、聚集、点击。',
    data () {
      return {
      }
    },
    methods: {
    }
  }
</script>

<style lang="scss">
</style>